import React, { useEffect, useState } from 'react'
import { Button, Form, Input, Card, message } from 'antd';
import { addHospitalRequest, updataHospitalRequest, gethospitalItemRequest } from '@/api/hospital/hospitalSet'
import style from '../hospitalSet/index.module.css'
import type { addHospitalType, gethospitalItemType } from '@api/hospital/model/hospitalTypes'
import { useNavigate, useParams } from 'react-router-dom';
export default function AddOrUpdata() {
    const navigate = useNavigate()
    const { id } = useParams()
    useEffect(() => {
        if (id) { //因为这个组件是添加和修改公用的 所以要进行判断 当从添加进去入 则此时id为undefined 从修改进入id才会有对应的值
            const gethospitalItem = async () => {
                const result = await gethospitalItemRequest(id)
                console.log(result);
                form.setFieldsValue(result)
            }
            gethospitalItem()
        }
    }, [])


    const addHosSetList = async (fieldValue: gethospitalItemType) => {
        console.log('id',id);
        
        if (id) {
            await updataHospitalRequest({...fieldValue,id})
            message.success('修改成功')
        } else {
            await addHospitalRequest(fieldValue)
           message.success('新增成功')
        } 
        navigate(-1)
    }

    const [form] = Form.useForm() //利用Form中的useForm表单创建一个数组form
    // console.log(Form.useForm());


    return (
        <div>
            <Card>
                <Form
                    form={form} //给表单一个form属性与上面的创建的form进行关联
                    name="basic"
                    labelCol={{ span: 2 }}
                    wrapperCol={{ span: 22 }}
                    onFinish={addHosSetList}
                    initialValues={{ remember: true }}
                    autoComplete="off"
                >
                    <Form.Item
                        label="医院名称"
                        name="hosname"
                        rules={[{ required: true, message: '请输入正确的医院名称！' }]}
                    >
                        <Input />
                    </Form.Item>

                    <Form.Item
                        label="医院编号"
                        name="hoscode"
                        rules={[{ required: true, message: '请输入正确的医院编号！' }]}
                    >
                        <Input />
                    </Form.Item>

                    <Form.Item
                        label="api基础路径"
                        name="apiUrl"
                        rules={[{ required: true, message: '请输入正确的api基础路径!' }]}
                    >
                        <Input />
                    </Form.Item>
                    <Form.Item
                        label="联系人姓名"
                        name="contactsName"
                        rules={[{ required: true, message: '请输入正确的联系人姓名!' }]}
                    >
                        <Input />
                    </Form.Item>
                    <Form.Item
                        label="联系人手机"
                        name="contactsPhone"
                        rules={[{ required: true, message: '请输入正确的联系人手机!' }]}
                    >
                        <Input />
                    </Form.Item>

                    <Form.Item wrapperCol={{ offset: 2 }}>
                        <Button type="primary" htmlType="submit" className={style.mr}>
                            保存
                        </Button>
                        <Button
                            type="default"
                            htmlType="button"
                            onClick={() => {
                                navigate(-1)
                            }}
                        >
                            返回
                        </Button>
                    </Form.Item>



                </Form>
            </Card>
        </div>
    )
}

